<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
    <title>传智健康</title>
    <link rel="stylesheet" href="../css/base.css"/>
    <script src="../plugins/jquery/dist/jquery.min.js"></script>
    <script src="../plugins/vue/vue.js"></script>
    <script src="../plugins/vue/axios-0.18.0.js"></script>
    <script src="../plugins/elementui/index.js"></script>
    <script src="../plugins/healthmobile.js"></script>
</head>
<body>
<div class="bg_bank"  id="app">
    <a class="re_bank" href="###"></a>
    <div class="re_min_infor">
        <div class="re_logo" class=""><img src="../img/logo.png" width="5000px"></div>
        <div class="bg_color">
            <div class="re_min">
                <span class="icon_phone"></span>
                <input class="input01" id="phone" name="phone" type="text" placeholder="手机"
                       v-model="loginInfo.telephone"/>
                <div id="div1"></div>
            </div>
            <div class="re_min">
                <span class="icon_vf_code"></span>
                <input class="input01" v-model="loginInfo.validateCode" class="login_btn" id="code" name="code" type="password" placeholder="请输入验证码"/>
                <input class="reto_code"  @click="sendValidateCode()" type="button"  id="validateCodeButton" value="发送验证码"/>
            </div>
        </div>
        <div class="re_regist">
            <a class="btn_regist" @click="login()" id="login">登录</a>
        </div>
    </div>
</div>
<!--<script src="../plugins/jquery/dist/jquery.min.js"></script>-->
<!--<script type="text/javascript" src="../js/jquery-1.11.3.min.js"></script>-->
<script type="text/javascript" src="../js/index.js"></script>
</body>
<script>
    var vue = new Vue({
        el:'#app',
        data:{
            loginInfo:{}//登录信息
        },
        methods:{
            //发送验证码
            sendValidateCode(){
                var telephone = this.loginInfo.telephone;
                if (!checkTelephone(telephone)) {
                    this.$message.error('请输入正确的手机号');
                    return false;
                }
                validateCodeButton = $("#validateCodeButton")[0];
                clock = window.setInterval(doLoop, 1000); //一秒执行一次
                axios.post("/validateCode/send4Login.do?telephone=" + telephone).then((response) => {
                    if(!response.data.flag){
                        //验证码发送失败
                        this.$message.error('验证码发送失败，请检查手机号输入是否正确');
                    }
                });
            },
            //登录
            login(){
                var telephone = this.loginInfo.telephone;
                if (!checkTelephone(telephone)) {
                    this.$message.error('请输入正确的手机号');
                    return false;
                }
                axios.post("/member/login.do",this.loginInfo).then((response) => {
                    if(response.data.flag){
                        //登录成功,跳转到member.html
                        window.location.href="member.html";
                    }else{
                        //失败，提示失败信息
                        this.$message.error(response.data.message);
                    }
                });
            }
        }
    });
</script>
</html>
